<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head>
    <meta charset="UTF-8">
    <title>博客</title>
    <link rel="icon" href="/img/favicon.ico">
</head>
<body>
<div th:include="header.html"></div>
<ol class="am-breadcrumb">
    <span>您现在所在位置为： </span>
    <li th:each="node,nodeStat : ${route}" th:class="${nodeStat.last} ? 'am-active'">
        <a th:hidden="${nodeStat.last} ? 'true'" th:href="${nodeStat.last} ? '' : '/blog?catalogId=' + ${node.getId()}"
           th:text="${node.getName()}"></a>
        <span th:hidden="${nodeStat.last} ? 'false' : 'true'" th:text="${node.getName()}"></span>
    </li>
    </ol>
    <hr/>
    <div class="am-g">
        <div class="am-u-lg-2">
            <ul id="tree" class="filetree">
                <li><a th:class="${catalogRoot.subCatalogs} != null? 'folder' : ''" th:text="${catalogRoot.getName()}"
                       th:href="'/blog?catalogId=' + ${catalogRoot.getId()}"></a>
                    <ul th:class="${catalogRoot.subCatalogs} != null? '' : 'hide'"
                        th:each="catalog1 : ${catalogRoot.getSubCatalogs()}">
                        <li><a th:class="${catalog1.subCatalogs} != null? 'folder' :''" class="folder"
                               th:text="${catalog1.getName()} " th:href="'/blog?catalogId=' + ${catalog1.getId()}"></a>
                            <ul th:class="${catalog1.subCatalogs} != null? '' :'hide'"
                                th:each="catalog2 : ${catalog1.getSubCatalogs()}">
                                <li><a th:class="${catalog2.subCatalogs} != null? 'folder' : ''"
                                       th:text="${catalog2.getName()}"
                                       th:href="'/blog?catalogId=' + ${catalog2.getId()}"></a>
                                    <ul th:class="${catalog2.subCatalogs} != null? '' :'hide'"
                                        th:each="catalog3 : ${catalog2.getSubCatalogs()}">
                                        <li><a th:class="${catalog3.subCatalogs} != null? 'folder' : ''"
                                               th:text="${catalog3.getName()}"
                                               th:href="'/blog?catalogId=' + ${catalog3.getId()}"></a>
                                            <ul th:class="${catalog3.subCatalogs} != null? '' :'hide'"
                                                th:each="catalog4 : ${catalog3.getSubCatalogs()}">
                                                <li><a th:class="${catalog4.subCatalogs} != null? 'folder' : ''"
                                                       th:text="${catalog4.getName()}"
                                                       th:href="'/blog?catalogId=' + ${catalog4.getId()}"></a>
                                                    <ul th:class="${catalog4.subCatalogs} != null? '' :'hide'"
                                                        th:each="catalog5 : ${catalog4.getSubCatalogs()}">
                                                        <li><a th:class="${catalog5.subCatalogs} != null? 'folder' : ''"
                                                               th:text="${catalog5.getName()}"
                                                               th:href="'/blog?catalogId=' + ${catalog5.getId()}"></a>
                                                            <ul th:class="${catalog5.subCatalogs} != null? '' :'hide'"
                                                                th:each="catalog6 : ${catalog5.getSubCatalogs()}">
                                                                <li>
                                                                    <a th:class="${catalog6.subCatalogs} != null? 'folder' : ''"
                                                                       th:text="${catalog6.getName()}"
                                                                       th:href="'/blog?catalogId=' + ${catalog6.getId()}"></a>
                                                                    <ul th:class="${catalog6.subCatalogs} != null? '' :'hide'"
                                                                        th:each="catalog7 : ${catalog6.getSubCatalogs()}">
                                                                        <li><a th:text="${catalog7.getName()}"
                                                                               th:href="'/blog?catalogId=' + ${catalog7.getId()}"></a>
                                                                        </li>
                                                                    </ul>
                                                                </li>
                                                            </ul>
                                                        </li>
                                                    </ul>
                                                </li>
                                            </ul>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
        <div class="am-u-lg-10">
            <div data-am-widget="list_news" class="am-list-news am-list-news-default">
                <div class="am-list-news-bd">
                    <ul th:each="article : ${articles}" class="am-list">
                        <li class="am-g am-list-item-desced">
                            <a th:href="@{'/article?articleId='+${article.getId()}}" th:text="${article.getTitle()}"
                               class="am-list-item-hd"></a>
                            <div th:text="'作者：' + ${article.getAuthorUsername()}  + '， 摘要：' + ${article.getArticleAbstract()} + '， 最后修改时间：' + ${article.getLastModified()} + ', 分类：' + ${article.getCatalogName()}"
                                 class="am-list-item-text am-text-primary"></div>
                        </li>

                    </ul>
                </div>
            </div>

        </div>
    </div>
<div th:include="footer.html"></div>
<script src="/js/jquery.min.js" type="text/javascript"></script>
<script src="/js/jquery.treeview.js" type="text/javascript"></script>
<script src="/js/amazeui.min.js" type="text/javascript"></script>
<script src="/js/handlebars.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $("#tree").treeview();
</script>
<link rel="stylesheet" href="/css/amazeui.min.css">
<link rel="stylesheet" href="/css/amazeui.flat.css">
<link rel="stylesheet" href="/css/jquery.treeview.css">
</body>
</html>